const  path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const VueLoaderPlugin = require('vue-loader/lib/plugin');
const ExtractTextWebpackPlugin = require('extract-text-webpack-plugin');
module.exports = {
    entry: {
        'sfy': './src/main.ts'
    },
    output: {
        path: path.resolve(__dirname, '../dist'),
        filename: process.env.NODE_ENV != 'production' ? 'js/[name].js' : 'js/[name].[hash:8].js',
        // 线上发布对应的静态资源加载路径的前缀目录配置
        publicPath: process.env.__STATIC__,
    },
    resolve: {
        extensions: ['.ts', '.tsx', '.js','.json'],
        alias: {
            'vue': 'vue/dist/vue.js',
            'src': path.resolve(__dirname, '../src'),
            'config': path.resolve(__dirname, '../config'),
            'views': path.resolve(__dirname, '../src/views'),
        }
    },
    module: {
        rules: [
            {
                test: /\.vue$/,
                exclude: /node_modules/,
                loader: 'vue-loader',
            },
            {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: 'babel-loader',
            },

            {
                test: /\.(png|jpg|gif|svg)$/,
                loader: 'file-loader',
                options: {
                    name: '[name].[ext]?[hash]',
                    publicPath: process.env.__STATIC__,
                }
            },
            {
                test: /\.(eot|svg|ttf|woff|woff2)(\?\S*)?$/,
                use: [
                    {loader: 'file-loader', options: {name: 'fonts/[name].[hash:8].[ext]'}}//项目设置打包到dist下的fonts文件夹下
                ]
            },
            {
                test: /\.tsx?$/,
                loader: 'ts-loader',
                exclude: /node_modules/,
                options: {
                    appendTsSuffixTo: [/\.vue$/]
                }
            },
            {
                test: /\.(scss|css)$/,
                use: ExtractTextWebpackPlugin.extract({
                    use: [
                        {loader: "css-loader"},
                        {
                            loader: "postcss-loader",
                            options: {
                                plugins: [require("autoprefixer")],
                                sourceMap: true,
                            }
                        },
                        {
                            loader: "postcss-loader",
                            options: {
                                sourceMap: true,
                                config: {
                                    path: './postcss.config.js' 
                                }
                            }
                        },
                        {
                            loader: "sass-loader",
                            options:{
                              sourceMap: true,
                            }
                        }
                    ],
                    fallback: 'style-loader',
                })
            },
        ]
    },
    //引入第三方插件
    plugins: [
        new VueLoaderPlugin(),
        new HtmlWebpackPlugin({
            template: './index.html',
            filename: 'index.html',
            title: '索菲亚',
            chunks: ['sfy'],
        })
    ],
    //性能如果一个资源超过 250kb，webpack 会对此输出一个警告来通知你。
    performance: {
        hints: false
    },
}